<template>
  <el-form
    class="ev-form"
    :model="row"
    v-bind="$attrs"
  >
    <ed-form-fields
      :fields="fields"
      v-model="row"
      :label-position="$attrs.labelPosition"
    />
    <slot />
    <el-form-item>
      <ed-toolbar
        v-bind="toolbar"
        :row="row"
        @click="click"
      />
    </el-form-item>
  </el-form>
</template>

<script>
import EdToolbar from '../components/EdToolbar'
import EdFormFields from '../components/form/EdFormFields'

export default {
  props: {
    /**
     * 域列表
     */
    fields: {
      type: Array,
      default: () => []
    },
    /**
     * 数据地址
     */
    url: {
      type: String,
      default: null
    },
    /**
     * 工具栏
     */
    toolbar: {
      type: Object,
      default: () => null
    }
  },
  data () {
    return {
      row: {}
    }
  },
  components: {
    EdToolbar,
    EdFormFields
  },
  async created () {
    if (this.url) {
      const data = await this.$http.Get(this.url)
      if (data && data.row) this.row = data.row
    }
  },
  methods: {
    async click (btn, row) {
      try {
        await this.$http.Fire(btn, row)
      } catch (e) {}
    },
    change (value) {
      this.row = value
    }
  }
}
</script>

<style scoped>
</style>
